<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Mask behaviour when mask contains a symbol element</title>
  <link rel="match" href="green-100x100.svg">
  <link rel="help" href="https://drafts.fxtf.org/css-masking-1/#MaskElement">
  <meta name="assert" content="A symbol in a mask should not be displayed">
</head>
<style>
  html, body, svg {
    padding: 0;
    margin: 0;
  }
</style>
<body>
  <svg width="200" height="200">
    <defs>
      <mask id="aMask">
        <symbol>
          <rect x="0" y="0" width="100" height="100" fill="#ffffff"/>
        </symbol>
      </mask>
    </defs>
    <rect width="100" height="100" fill="green"/>
    <foreignObject width="200" height="200" style="mask: url('#aMask');">
      <div style="width: 200px; height: 200px; background: red;"></div>
    </foreignObject>
  </svg>
</body>
</html>
